<template lang="html">
  <div class="">
        <div class="content mb-50">
          <div class="mt-10 bg-fff">
            <div class="pd-15 my-line">
              <div class="my-14-22 fc-333">
                <span class="fz-16"> 王柏川 </span>
                <span class="fr" > 18874839222</span>
              </div>
              <div class="mt-10 fz-8">安徽省黑市蜀山区望江西路温馨家园111</div>
            </div>
            <div class="pd-15 clearfix">
              <div class="fl fz-9">
                <span class="moren">[默认]</span>
              </div>
              <!-- <div class="fl my-14-22">
                <span class="moren">设为默认地址</span>
              </div> -->
              <div class="fr fz-8">
                <router-link :to="{ name: '', params: {} }">
                  <span class="fz-8" id="dl">删除</span>
                </router-link>
                <router-link :to="{ name: 'my_address_edit', params: {} }">
                  <span class="fz-9" id="edit">编辑</span>
                </router-link>
              </div>
            </div>
          </div>
          <router-link :to="{ name: 'my_address_add', params: {} }">
             <button class="login-btn w-80">新增收货地址</button>
          </router-link>
      </div>
      <div class="nodata" v-if="list.length<1">
        <img src="./images/no-adress.svg">
        <span>您还没有添加地址</span>
        <div class="btn-go mt-50">新增收货地址</div>
      </div>
  </div>
</template>

<script>

export default {
  components: {

  },
  data(){
    return{
    list:[1111],
    };
  },
  methods: {
    refresh (done) {
      if (this.list.length) {
          this.list.length = 0
      }
    },
  },
}
</script>

<style scoped>
  .content{
    text-align: left;
  }
  .fz-16{
    font-size: .8rem;
  }
    .pos {
    background: #f23030;
    border-radius: .1rem;
    width: 100%;
    height: 2.5rem;
    line-height: 2.5rem;
    position: absolute;
    bottom: 0;
    font-size: 16px;
    color: #ffffff;
    }
    .nodata{
      width:100%;
      text-align:center;
      padding-top:30%;
      margin-top: .5rem;
    }
    .nodata span{
      color: #666;
      display:block;
      font-size:.7rem;
      padding-top:.5rem;
    }
    .btn-go{
      display:inline-block;
      font-size:.75rem;
      line-height:1.5;
      background-color:#ffffff;
      color: #F74C4E;
      padding:.45rem 3.9rem;
      border-radius:5rem;
      border: 1px solid #F74C4E;
    }

    .moren {
      position: relative;
      bottom: .25rem;
      left: .5rem;
      font-size: .65rem;
    }

    .fz-8 {
      font-size: .65rem;
      color: #777777;
    }
    .fz-9 {
      font-size: .65rem;
      color: #f74c4e;
    }
    .fc-333 {
      color: #333333;
    }

    #dl {
      border-right: 2px #cecece solid;
      padding-right:.5rem;
    }
    #edit {
      margin-left: .5rem;
    }
    .w-80 {
      margin-left: 5%;
      width: 90%;
      font-size: 0.75rem;
    }

</style>
